<template>
<transition name="slide-fade">
  <div class="app-container">
    <el-dialog
      :visible.sync="visible"
      title="提示"
      :content="msg"
      :left="left"
      :right="right">
    </el-dialog>
  </div>
</transition>
</template>

<script>
/* eslint-disable object-property-newline */

export default {
  name: 'App',
  data() {
    return {
      visible: false,
      msg: '需要注意的是内容是默认不居中的 ',
      left: { text: '取消', cb: () => {
        console.log('fail');
      } },
      right: { text: '确定', cb: () => {
        console.log('success');
      } },

    };
  },
  methods: {},
};
</script>

<style>
  *{
    margin: 0;
    padding: 0;
  }
  .app-container{
    width: 100vw;
    height: 100vh;
    background:rgba(0,0,0,.2);
  }
</style>
